<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
      /*a{ color: red}*/
      .t1{ text-decoration: none}
      #t2{ background-color: #12FA62}
      /*最终生效的样式,把之前声明的同名属性的值覆盖了*/
      #t2{ background-color: pink}
      /* 思考:后声明的同名属性的赋值, 总会覆盖先前声明的属性的赋值吗?*/
      /* 下方内容会生效吗? 为什么? 不会生效 因为权重*/
      /* 权重 CSS权重的底层算法不是简单的加算*/
      /* 内联style 1000 id选择器 100  类class选择器 10  标签选择器 1 */
      /* !important 理论来说无穷大 权重最最最最最高*/
      .t1{ background-color: yellow !important;}
      /*继承性 不是所有的样式都可以被继承*/
      div{ color: #e87c1b;
          font-size: 40px;
          text-decoration: overline;


      }
  </style>

</head>
<body>
<a class="t1" id="t2" style="background: #e87c1b">百度</a>
<div>

  <a>baidu</a>
</div>
</body>
</html>